Arrays 


JavaScript variables are useful for storing single 
values to be used in later parts of the program. 
However, what if you need to store a list of values, * 
like the names of invitees to a party? 


This is where arrays come in useful. Arrays are likes lists, they are a data 
structure that stores a sequence of values that can be added, removed, or 
modified. 


Creating an array 


To create an array in JavaScript, we write: 


let newArray = [] 


This creates an empty array (an array with no items). We can also create 
the array with preset values: 


let partyPeople = [ ; : ] 


Note that in JavaScript, items in an array can be of different types. 


Accessing array items 


Just like characters in a string, array items are ordered and indexed. This 
means that every item is assigned a number starting from @ that 
represents its position in the array. 


Getting items 


Consider the partyPeop le array in the Creating an array section. To get 
an item using its index, we write: 


console.log(partyPeople[0]) // Spongebob 


console.log(partyPeople[1]) // Patrick 
console.log(partyPeople[2]) // Sandy 


Using an invalid index will result in undefined: 


console.log(partyPeople[3]) // undefined 
console.log(partyPeople[-1]) // undefined 


Assigning items 


Items in an array can be modified, that means that you can reassign them 
or add new items. To replace items in an array, we write: 


partyPeople[1] = "Gary" 
// partyPeople: ["Spongebob", "Gary", "Sandy"] 


You can also assign values to larger indexes, in which case the values will 
be added to the array at that index: 


partyPeople[3] = "Squidward" 
// paxrtyPeople: ["Spongebob", "Gary", "Sandy", 
"Squidward" ] 


partyPeople[5] = "Plankton" 
// paxrtyPeople: ["Spongebob", "Gary", "Sandy", 
"Squidward", undefined, "Plankton"] 


We will look at other ways to modify an array in the Modifying arrays section 
below. 


Looping 


It may be useful to perform an action on each item in an array, such as to 
send invites to each guest: 


sendiInvite(partyPeople[0] ) 
sendiInvite(partyPeople[1] ) 
sendiInvite(partyPeople[2] ) 


sendiInvite(partyPeople[3]) 
sendiInvite(partyPeople[4] ) 
sendiInvite(partyPeople[5] ) 


In JavaScript, you can use the for loop and for...oOf loop to iterate 
over the items in an array. 


Using a for loop 


You can use the standard for loop to iterate over the array indexes and 
access each item in the array: 


for (let index = 0; index < students.length; i++) { 
sendiInvite(partyPeople[index]); 
i 


Using a for...oOf loop 


Just like strings, you can also use the simpler for...oOf to iterate over 
the items in an array: 


for (let person of partyPeople) 3} 


sendiInvite (person) 


5 


Modifying arrays 


Arrays in JavaScript contain several methods that modify the array in 
different ways. We will explore the following methods: 


push 
The push method appends an item to the end of the array 


let snacks 


snacks. push( 
// snacks: ["fries", "chips", "Krabby Patties" ] 


pop 
The pop method removes the last item of the array and returns it: 


let drinks 


let unwantedDrink = drinks.pop() 
// drinks: ["soda", "orange juice" ] 


console. 1log( + unwantedDrink + 


) 


// We removed tea because we hate it 


shift 


The shift method removes the first item of the array and returns it: 


let games = ["uno", "monopoly", "cluedo", "risk"] 


let game = games.shift() 
// games: ["monopoly", "“cluedo", "risk" ] 


console.log("The first game for tonight is " + game) 


// The first game for tonight is uno 


unshift 
The unshift method inserts an item to the start of the array: 


let movies = ["No Way Home", "Multiverse of 
Madness" | 


movies.unshift ("Uncharted") 
// movies: ["Uncharted", "No Way Home", "Multiverse 
of Madness" ] 


Other methods 


If you would like to check out the other array methods built in to JavaScript, 
check out the documentation 
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